﻿
@{
    ViewData["Title"] = "BacthAddOverTime";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="layui-container">

    <div class="layui-row">


        <div class="layui-card">
            <div class="layui-card-header">加班时间</div>
            <div class="layui-card-body">
                <div class="layui-input-inline " style=" display:flex; flex-direction: row">
                    <label class="layui-form-label" style="width:40px;">加班日期</label>
                    <input type="text" class="layui-input" id="mdate" placeholder="2020-06-26">
                    <label class="layui-form-label" style="width:40px;">开始时间</label>
                    <input type="text" class="layui-input" id="mbegin" placeholder="1830">
                    <label class="layui-form-label" style="width:40px;">结束时间</label>
                    <input type="text" class="layui-input" id="mend" placeholder="2200">
                </div>
            </div>
        </div>

    </div>
    <div class="layui-row">

        <div class="layui-col-md4">
            <table class="layui-hide" id="dept" lay-filter="depts"></table>
        </div>
        <div  class="layui-col-md8">

            <table class="layui-hide" id="emp" lay-filter="emps"></table>

        </div>
    </div>
</div>




<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="bach">批量加班</button>

    </div>
</script>
<script>
    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#mdate' //指定元素
        });
    });
</script>

<script>
    layui.use('table', function () {
        var table = layui.table;

        table.render({
            elem: '#dept'
        
            , url: '/main/GetDeptList/'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增s
            , cols: [[
                ,   {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
                , { field: 'fullCode', width: 80, title: '编号' }
                , { field: 'fname', width: 80, title: '部门', sort: true }
                

            ]]
            , totalRow: true
            , page: true
         
            , limit: 10  
            , loading: true

        });
          table.on('row(depts)', function(obj){
                 console.log(obj.tr);//得到当前行元素对象
              console.log(obj.data.fullCode); //得到当前行数据
              console.log(obj.data);
              table.reload('testReload', {
             url: '/Main/GetDeptUserList/?deptid='+obj.data.fullCode
 // ,where: {} //设定异步数据接口的额外参数
  //,height: 300
});

  //obj.del(); //删除当前行
  //obj.update(fields) //修改当前行数据

  

});
    


    });

  



</script>

<script>
          layui.use('table', function () {
        var table = layui.table;

        table.render({
            elem: '#emp'
            , toolbar: '#toolbarDemo'
            , url: '#'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增s
            , cols: [[
                { type: 'checkbox' }
                , { field: 'fname', width: 80, title: '姓名' }
                , { field: 'empNo', width: 80, title: '工号', sort: true }
                , { field: 'eBm', width: 80, title: '部门' }

            ]]
            , totalRow: true
            , page: true
            , id: 'testReload'
            ,limits:10
            ,text:'请选择相关部门'
            , loading: true

        });
        table.on('toolbar(emps)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'bach':
                    layer.msg('批量加班');
                    var checkStatus = table.checkStatus('testReload');
                    var data = checkStatus.data;
                   // layer.alert(JSON.stringify(data));
                    console.log(JSON.stringify(data));
                    var dt = new Array();

                    var dtt = $('#mdate').val();
                    var bg = $('#mbegin').val();
                    var ed = $('#mend').val();


                    if (dtt == '') {
                        layer.msg('请选择正确的日期');

                        console.log('please select the right date');
                    } else if (bg == '' || isNaN(bg) || bg.length != 4) {
                        layer.msg('请选择正确的开始时间');
                        console.log('please select the right begin time');
                    } else if (ed = '' || isNaN(ed) || ed.length != 4) {
                        layer.msg('请选择正确的结束时间');
                        console.log('please select the right end time');
                    } else {

                        for (let i = 0; i < data.length; i++) {

                            console.log(data[i].empNo);
                            dt[i] = data[i].empNo;
                        }
                        $.ajax({
                            type: 'POST',
                            url: '/api/user/otime',
                            data: {
                                date: $('#mdate').val(),
                                begin: $('#mbegin').val(),
                                end: $('#mend').val(),
                                lst: dt,
                            }, dataType: "json",
                            success: function (data) {
                                layer.msg(data.msg);
                            }, error: function () {
                                layer.msg("请求失败，请再次尝试，或者检查网络", { icon: 5, time: 2000 });

                            }




                        });


                    }


                    break;
                case 'delete':
                    layer.msg('删除');
                    break;
                case 'update':
                    layer.msg('编辑');
                    break;
            };

        });


    });
</script>
